<template>
  <div>
    <PopSelectTooltip :options="departmentOptions" v-model:value="curValue" @on-select="emits('onSelect')"
                      empty-label="科室">
      <template #icon>
        <n-icon size="22" style="margin-right: 5px">
          <Icon icon="carbon:category"></Icon>
        </n-icon>
      </template>
    </PopSelectTooltip>
  </div>
</template>

<script setup lang="ts">
import PopSelectTooltip from "@/components/common/select/PopSelectTooltip.vue";
import api from "@/api";
import {computed, onMounted, ref} from "vue";
import {Icon} from "@iconify/vue";

const props = defineProps({
  value: {
    type: String,
    default: ''
  },
})
const emits = defineEmits(['update:value', 'onSelect'])
const departmentOptions = ref([{
  label:'全部',
  value:''
}])
onMounted(() => {
  getDepartments()
})

const getDepartments = () => {
  api.department.list().then((res => {
    if (res.data.code === 0) {
      let tmp = res.data.data
      Object.keys(tmp).forEach((key: string | number) => {
        departmentOptions.value.push({
          label: tmp[key].department,
          value: tmp[key].department
        })
      })
      console.log(departmentOptions.value)
    }
  }))
}


const curValue = computed({
  get() {
    return props.value
  },
  set(val) {
    emits('update:value', val)
  }
})


</script>

<style scoped>

</style>